<template>
	<view class="content">
		<text>图片路径：{{imagePath}}</text>
		<demo class="demo" :src="images[currentImagesIndex]" @imageChange="hadleImageChange"></demo>
		
	</view>
	
</template>

<script>
	/*
	1、创建按组件
	2、引入组件
	3、注册组件
	4、使用组件
	
	*/
	import demo from '@/components/demo.vue'
	export default {
		data() {
			return {
				images:['/static/logo.png','/static/2.jpeg'],
				currentImagesIndex:0,
				imagePath:''
				
			};
		}
		,components:{
			demo
		},
		methods:{
			hadleImageChange(e){
				console.log(e);
				if(this.currentImagesIndex==0){
					this.currentImagesIndex=1;
				}
				else{
					this.currentImagesIndex=0;
				}
				this.imagePath=e;
			}
		},onLoad(){
			//获取Vue原型设置的全局变量值
			console.log(this.baseUrl);
			//获取globalData的全局变量值
			console.log(getApp().globalData.isLogin);
		}
	}
</script>

<style lang="scss">
	/* rpx是小程序的宽度,750是屏幕的宽度 */

.rpx{
	width: 750rpx;
	height: 100px;
	background-color: red;
}
/* vw是h5单位100vw是屏幕的宽度 100vh是屏幕的高度 */
.vw{
	width:50vw;
	height:100px;
	background-color: blue;
	
}
.content{
	.sass{
		background: yellow;
	}
	.demo{
		height: 100px;
		width: 750rpx;
	}
}
</style>
